﻿@model FitCalc.Models.PaceSpeedCalculatorModel
@*<script src="../../Scripts/jquery-1.4.4-vsdoc.js" type="text/javascript"></script>*@
<script src="../../Scripts/json2.js" type="text/javascript"></script>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<script type="text/javascript">
    function rectime(sec)
    {
        var hr = Math.floor(sec / 3600);
        var min = Math.floor((sec - (hr * 3600)) / 60);
        sec -= ((hr * 3600) + (min * 60));
        sec = parseInt(sec);
        sec += ''; min += '';
        while (min.length < 2) { min = '0' + min; }
        while (sec.length < 2) { sec = '0' + sec; }
        hr = (hr) ? hr + ':' : '';
        return hr + min + ':' + sec;
    }

    var tempSeconds = null;
    var tempMinutes = null;
    var tempSpeed = null;
    //$(document).ready(function()
    $(InitPage);
    function InitPage()
    {
        tempSeconds = $("#paceSeconds:first");
        tempMinutes = $("#paceMinutes:first");
        tempSpeed = $("#speed:first");
        $("#paceLabel").text(tempMinutes.val() + ":" + tempSeconds.val());
        $("#speedKmLabel").text(tempSpeed.val().replace(",", "."));
        var totSeconds = parseFloat(tempMinutes.val()) * 60 + parseFloat(tempSeconds.val());
        $("#5000TimeLabel").text(rectime(totSeconds * 5));
        $("#10000TimeLabel").text(rectime(totSeconds * 10));
        $("#HalfMarathonTimeLabel").text(rectime(totSeconds * 21.097));
        $("#MarathonTimeLabel").text(rectime(totSeconds * 21.097 * 2));

        var paceSpeed = { paceMinutes: tempMinutes.val(),
            paceSeconds: tempSeconds.val(),
            speed: tempSpeed.val()
        };
        $('input:text[data-val=true]'
                        ).each
                        (function 
                            ()
                        {
                            $(this).attr('size', $(this).attr('data-val-length-max'));

                            $(this).attr('maxlength', $(this).attr('data-val-length-max'));
                        }
                        )

        $(function ()
        {
            setTimeout(checkSearchChanged, 0.5);
        });
        function IsNumeric(input) { return (input - 0) == input && input.length > 0; }

        function checkSearchChanged()
        {
            var currentPaceSpeed = { paceMinutes: tempMinutes.val(),
                paceSeconds: tempSeconds.val(),
                speed: tempSpeed.val()
            };
            //$("#prova").html(tempSeconds.valid());
            //            if (((currentPaceSpeed.paceMinutes)
            //                    && (paceSpeed.paceMinutes)
            //                    && currentPaceSpeed.paceMinutes != paceSpeed.paceMinutes
            //                     && currentPaceSpeed.paceMinutes != ''
            //                      && currentPaceSpeed.paceMinutes > 0
            //                      )
            //                    || ((currentPaceSpeed.paceSeconds) && currentPaceSpeed.paceSeconds != paceSpeed.paceSeconds && currentPaceSpeed.paceSeconds != '' && currentPaceSpeed.paceSeconds > -1)
            //                    || ((currentPaceSpeed.speed) && currentPaceSpeed.speed != paceSpeed.speed && currentPaceSpeed.speed != '' && currentPaceSpeed.speed.replace(',', '.') > 0)
            if (currentPaceSpeed.paceMinutes != paceSpeed.paceMinutes || currentPaceSpeed.paceSeconds != paceSpeed.paceSeconds || currentPaceSpeed.speed != paceSpeed.speed)
            {
                if ((tempMinutes.valid() && tempSeconds.valid() && tempSpeed.valid()))
                {

                    //alert("ok inizioe");
                    if ((currentPaceSpeed.speed) && (paceSpeed.speed != null) && currentPaceSpeed.speed != paceSpeed.speed)
                    {
                        // if speed changed
                        paceSpeed =
                        { paceMinutes: null,
                            paceSeconds: null,
                            speed: $("#speed").val().replace(".", ",")
                        };
                    }
                    else
                    {
                        paceSpeed =
                        { paceMinutes: $("#paceMinutes").val(),
                            paceSeconds: $("#paceSeconds").val(),
                            speed: null
                        }
                    }

                    var jsonString = JSON.stringify(paceSpeed);
                    $.ajax(
                    {
                        url: '/Calculator/PaceToSpeed',
                        type: "POST",
                        data: jsonString,
                        dataType: "json",
                        contentType: "application/json; charset=utf-8",
                        dataFilter: function (data, dataType)
                        {
                            if (data.indexOf("<!-") > 0)
                            {
                                //alert(data.indexOf("<!-"));
                                //alert(data.substring(0, data.indexOf("<!-")));
                                return data.substring(0, data.indexOf("<!-"));
                            }
                            else
                                return data;
                        },
                        success: function (objResult)
                        {
                            $("#errorInfo").attr("style", "border: 3px coral solid;visibility:hidden");
                            var paceSpeedResult = objResult;

                            $("#speed").val(objResult.speed.replace(",", "."));
                            $("#paceSeconds").val(objResult.paceSeconds);
                            $("#paceMinutes").val(objResult.paceMinutes);

                            $("#paceLabel").text(objResult.paceMinutes + ":" + objResult.paceSeconds);
                            $("#speedKmLabel").text(objResult.speed.replace(",", "."));

                            var totSeconds = parseFloat(objResult.paceMinutes) * 60 + parseFloat(objResult.paceSeconds);
                            $("#5000TimeLabel").text(rectime(totSeconds * 5));
                            $("#10000TimeLabel").text(rectime(totSeconds * 10));
                            $("#HalfMarathonTimeLabel").text(rectime(totSeconds * 21.097));
                            $("#MarathonTimeLabel").text(rectime(totSeconds * 21.097 * 2));

                            paceSpeed = { paceMinutes: $("#paceMinutes").val(),
                                paceSeconds: $("#paceSeconds").val(),
                                speed: $("#speed").val()
                            };
                            setTimeout(checkSearchChanged, 0.5);
                        },
                        error: function (objResult)
                        {
                            paceSpeed = { paceMinutes: tempMinutes.val(),
                                paceSeconds: tempSeconds.val(),
                                speed: tempSpeed.val()
                            };
                            $("#errorInfo").html(objResult.status + "-" + objResult.statusText + ":" + objResult.responseText);
                            $("#errorInfo").attr("style", "border: 3px coral solid;visibility:visible");
                            setTimeout(checkSearchChanged, 0.5);
                        }
                    });
                }

                else
                {
                    paceSpeed = { paceMinutes: tempMinutes.val(),
                        paceSeconds: tempSeconds.val(),
                        speed: tempSpeed.val()
                    };
                    setTimeout(checkSearchChanged, 0.5);
                }
            }
            else
            {

                setTimeout(checkSearchChanged, 0.5);
            }

        }

    }
</script>
<h2>
    Index</h2>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Pace to speed calculator</legend>@* <div class="editor-label">
                @Html.LabelFor(model => model.paceMinutes)
            </div>
            *@
        <div>
            <div id="form" style="float: left">
                <div style="border-style:ridge">
                <div class="pace" style="padding:5px">
                    minutes  :  seconds</div>
                <div class="editor-field" style="padding:5px">
                    @Html.EditorFor(model => model.paceMinutes):
                    @Html.EditorFor(model => model.paceSeconds)
                    @Html.ValidationMessageFor(model => model.paceMinutes)
                    @Html.ValidationMessageFor(model => model.paceSeconds)
                </div>
                </div>
                <div style="border-style:ridge">
                <div class="editor-label" style="padding:5px">
                    @Html.LabelFor(model => model.speed) 
                    (km/h)
                </div>
                <div class="editor-field" style="padding:5px">
                    @Html.EditorFor(model => model.speed)
                    @Html.ValidationMessageFor(model => model.speed)
                </div>
                </div>
                <p>
                    <input type="submit" value="Save" />
                </p>
                <div style="border: 3px coral solid; visibility: hidden" id="errorInfo">
                </div>
            </div>
            <div id="conversions" style="float: left; margin-left: 20px;text-align:left">
                <p>
                    pace (min:sec): </p>
                <div id="paceLabel">
                </div>
                <p>
                    km/h: </p>
                <div id="speedKmLabel">
                </div>
                <p>time for 5.000m:</p><div id="5000TimeLabel">
                </div>
                <p>time for 10.000m:</p><div id="10000TimeLabel">
                </div>
                <p>time for 21.000m (half marathon):</p><div id="HalfMarathonTimeLabel">
                </div>
                <p>time for 42.000m (marathon):</p><div id="MarathonTimeLabel">
                </div>
            </div>
        </div>
    </fieldset>
}
<div>
    As you modify values inside this page the conversion is done *almost* immediately
    ("as you type")
</div>
<div>
    @Html.ActionLink("Back to List", "Index")
</div>
